<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/common/header.css" />
		<link rel="stylesheet" type="text/css" href="css/common/reset.css" />
		<link rel="stylesheet" type="text/css" href="css/common/footer.css" />
		<link rel="stylesheet" type="text/css" href="css/shoppingcart.css" />
	</head>
	<body>
		<!-- 头部导航栏 -->
		<div class="html-header">
			<div class="html-header-content clear-fix">
				<div class="html-header-content-l fl">
					<ul class="clear-fix">
						<li class="fl"><a href="" target="_blank">首页</a></li>
						<li class="fl"><a href="" target="_blank">华为官网</a></li>
						<li class="fl"><a href="" target="_blank">花粉俱乐部</a></li>
						<li class="fl"><a href="" target="_blank">V码(优购码)</a></li>
						<li class="fl"><a href="" target="_blank">企业购</a></li>
						<li class="fl"><a href="" target="_blank">Select Region</a></li>
						<li class="fl">
							<div class="l-more-wonder">
								<div class="l-more-wonder-h">
									<a href="" target="_blank">更多精彩</a>
								</div>
								<div class="l-more-wonder-m">
									<dl>
										<dt><a href="" target="_blank">EMUI</a></dt>
										<dt><a href="" target="_blank">应用市场</a></dt>
										<dt><a href="" target="_blank">华为终端云空间</a></dt>
										<dt><a href="" target="_blank">开发者联盟</a></dt>
									</dl>
								</div>
							</div>
						</li>
					</ul>
				</div>
				<div class="html-header-content-r fr">
					<ul class="clear-fix">
						<li class="fl"><a href="" target="_blank">请登录</a>
							<a href="" target="_blank">注册</a>
						</li>
						<li class="fl"><a href="" target="_blank">我的订单</a></li>
						<li class="fl">
							<div class="r-service">
								<div class="r-service-h">
									<a href="" target="_blank">客户服务</a>
								</div>
								<div class="r-service-m">
									<dl>
										<dt><a href="" target="_blank">服务中心</a></dt>
										<dt><a href="" target="_blank">联系客服</a></dt>
									</dl>
								</div>
							</div>
						</li>
						<li class="fl">
							<div class="r-webnav">
								<div class="r-webnav-h">
									<a href="" target="_blank">网站导航</a>
								</div>
								<div class="r-webnav-m clear-fix">
									<div class="r-webnav-m-l1 fl">
										<a href="">
											<span></span>
											商城首页
										</a>
									</div>
									<div class="r-webnav-m-l2 fl"
										style="width:185.0px;margin-top:22.0px;margin-bottom:20.0px;">
										<div class="r-webnav-m-l2-t bold black f16" style="margin-bottom:8.0px;">频道
										</div>
										<div class="r-webnav-m-l2-c clear-fix">
											<div class="fl" style="width:80.0px;overflow:hidden;margin-bottom:4.0px;"><a
													href="" target="_blank">华为专区</a></div>
											<div class="fl" style="width:80.0px;overflow:hidden;margin-bottom:4.0px;"><a
													href="" target="_blank">企业购</a></div>
											<div class="fl" style="width:80.0px;overflow:hidden;margin-bottom:4.0px;"><a
													href="" target="_blank">教育优惠</a></div>
										</div>
									</div>
									<div class="r-webnav-m-l3 fl"
										style="width:185.0px;margin-top:22.0px;margin-bottom:20.0px;">
										<div class="r-webnav-m-l3-t bold black f16" style="margin-bottom:8.0px;">产品
										</div>
										<div class="r-webnav-m-l3-c clear-fix">
											<div class="fl" style="width:80.0px;overflow:hidden;margin-bottom:4.0px;"><a
													href="" target="_blank">手机</a></div>
											<div class="fl" style="width:80.0px;overflow:hidden;margin-bottom:4.0px;"><a
													href="" target="_blank">笔记本</a></div>
											<div class="fl" style="width:80.0px;overflow:hidden;margin-bottom:4.0px;"><a
													href="" target="_blank">平板</a></div>
											<div class="fl" style="width:80.0px;overflow:hidden;margin-bottom:4.0px;"><a
													href="" target="_blank">智能穿戴</a></div>
											<div class="fl" style="width:80.0px;overflow:hidden;margin-bottom:4.0px;"><a
													href="" target="_blank">智能家居</a></div>
											<div class="fl" style="width:80.0px;overflow:hidden;margin-bottom:4.0px;"><a
													href="" target="_blank">智慧屏</a></div>
											<div class="fl" style="width:80.0px;overflow:hidden;margin-bottom:4.0px;"><a
													href="" target="_blank">耳机音箱</a></div>
											<div class="fl" style="width:80.0px;overflow:hidden;margin-bottom:4.0px;"><a
													href="" target="_blank">热销配件</a></div>
											<div class="fl" style="width:80.0px;overflow:hidden;margin-bottom:4.0px;"><a
													href="" target="_blank">生态产品</a></div>
											<div class="fl" style="width:80.0px;overflow:hidden;margin-bottom:4.0px;"><a
													href="" target="_blank">增值服务</a></div>
										</div>
									</div>
									<div class="r-webnav-m-l4 fl"
										style="width:185.0px;margin-top:22.0px;margin-bottom:20.0px;">
										<div class="r-webnav-m-l4-t bold black f16" style="margin-bottom:8.0px;">增值服务
										</div>
										<div class="r-webnav-m-l4-c clear-fix">
											<div class="fl" style="width:80.0px;overflow:hidden;margin-bottom:4.0px;"><a
													href="" target="_blank">以旧换新</a></div>
											<div class="fl" style="width:80.0px;overflow:hidden;margin-bottom:4.0px;"><a
													href="" target="_blank">补购保障</a></div>
											<div class="fl" style="width:80.0px;overflow:hidden;margin-bottom:4.0px;"><a
													href="" target="_blank">一口价换电池</a></div>
										</div>
									</div>
									<div class="r-webnav-m-l5 fl"
										style="width:185.0px;margin-top:22.0px;margin-bottom:20.0px;">
										<div class="r-webnav-m-l5-t bold black f16" style="margin-bottom:8.0px;">会员
										</div>
										<div class="r-webnav-m-l5-c clear-fix">
											<div class="fl" style="width:80.0px;overflow:hidden;margin-bottom:4.0px;"><a
													href="" target="_blank">会员频道</a></div>

										</div>
									</div>
								</div>
							</div>
						</li>
						<li class="fl">
							<div class="r-mobile">
								<div class="r-mobile-h">
									<a href="" target="_blank">手机版</a>
								</div>
								<div class="r-mobile-m">
									<div class="r-mobile-mc">

										<div class="r-mobile-mc-t1 clear-fix">
											<a href=""><img src="./img/header_img/FWETOIrFlCrX4xuB8E16.png"
													class="fl"></a>
											<div class="r-mobile-mc-t1r fl clear-fix">
												<h2 class="f14">华为商城APP</h2>
												<p class="f12">
													新人专享好礼
													<br>
													最高500积分
												</p>
												<span class="fl mgr-5 r-mobile-mc-t1r-android"></span>
												<span class="fl mgr-5 r-mobile-mc-t1r-iphone"></span>
												<span class="fl r-mobile-mc-t1r-wechat"></span>
											</div>
										</div>
										<div class="r-mobile-mc-t1 clear-fix">
											<a href=""><img src="./img/header_img/20181116180507506.jpg" class="fl"></a>
											<div class="r-mobile-mc-t1r fl clear-fix">
												<h2 class="f14">华为商城扫一扫</h2>
												<p class="f12">
													微信公众号
												</p>
												<span class="fl r-mobile-mc-t1r-wechat"></span>
											</div>
										</div>
										<div class="r-mobile-mc-t1 clear-fix"
											style="margin-bottom:0px; border-bottom: none;">
											<a href=""><img src="./img/header_img/6Y7SW4v4hnJ9kl9fDC9d.jpg"
													class="fl"></a>
											<div class="r-mobile-mc-t1r fl clear-fix">
												<h2 class="f14">微信小程序</h2>
												<span class="fl r-mobile-mc-t1r-wechat"></span>
											</div>
										</div>

									</div>
								</div>
							</div>
						</li>
					</ul>
				</div>
			</div>
		</div>

		<!-- 购物车页面标题 -->
		<div class="shopcart-title">
			<div class="shopcart-title-c clear-fix">
				<div class="fl clear-fix shopcart-title-c-l">
					<div class="fl"><a href="" target="_blank"><img src="img/shoppingcart_img/vmall_logo.png"></a></div>
					<div class="fl"><span>我的购物车</span></div>
				</div>
				<div class="shopcart-title-c-r fr">
					<div></div>
				</div>
			</div>
		</div>
		<!-- 购物车主体部分 -->
		<div class="shopcart-cc">
			<div class="shopcart-c">
				<div class="blank-20"></div>
				<!-- 购物车主体表头部分 -->
				<div class="shopcart-c-kind">
					<ul class="clear-fix">
						<li class="fl shopcart-c-kind-checkall">
							<div class="unchecked"></div>
						</li>
						<li class="fl">
							全选
						</li>
						<li class="fl">
							商品
						</li>
						<li class="fl">
							单价
						</li>
						<li class="fl">
							熟量
						</li>
						<li class="fl">
							小计
						</li>
						<li class="fl">
							操作
						</li>
					</ul>
				</div>
			<!-- 购物车详情 -->
			<div class="shopcart-detail">
			<div class="shopcart-item">
				<ul class="clear-fix">
					<li class="fl checkitem">
						<div class="unchecked"></div>
					</li>
					<li class="fl shopcart-item-img"><img src="./img/shoppingcart_img/shopcartgoods1.png" ></li>
				<li class="fl shopcart-item-intro">
					<div>
						<a href="" target="_blank">【运动款】HUAWEI WATCH GT 2 Pro 运动款 幻夜黑（46mm）两周长续航 心率监测 蓝宝石镜面 钛合金表体 陶瓷后壳 蓝牙通话智能手表</a>
						</div>
					<div>运动版 幻夜黑</div>
					<div>分期免息</div>
				</li>
				<li class="shopcart-item-unit-price fl">¥ <span>2188.00</span></li>
				<li class="shopcart-item-num fl">
					<div class="shopcart-item-num-c">
						<input type="num" name="" id="" value="1" />
						<p class="shopcart-item-num-c-btn clear-fix">
							<a href="javascript:;" class="shopcart-item-num-c-btn-minus">-</a>
							<a href="javascript:;" class="shopcart-item-num-c-btn-plus">+</a>
						</p>
					</div>
				</li>
				<li class="shopcart-item-unit-total-price fl">¥ <span>2188.00</span></li>
				<li class="shopcart-item-del fl"><a href="javascript:;">删除</a></li>
				</ul>
			</div>	
			<div class="shopcart-item">
				<ul class="clear-fix">
					<li class="fl checkitem">
						<div class="unchecked"></div>
					</li>
					<li class="fl shopcart-item-img"><img src="./img/shoppingcart_img/shopcartgoods2.png" ></li>
				<li class="fl shopcart-item-intro">
					<div>
						<a href="" target="_blank">
                            华为路由AX2 Pro（白色）Wi-Fi6路由 畅享4K影片 提供手游加速 儿童上网保护</a>
						</div>
					<div>白色</div>
	
				</li>
				<li class="shopcart-item-unit-price fl">¥ <span>229.00</span></li>
				<li class="shopcart-item-num fl">
					<div class="shopcart-item-num-c">
						<input type="num" name="" id="" value="1" />
						<p class="shopcart-item-num-c-btn clear-fix">
							<a href="javascript:;" class="shopcart-item-num-c-btn-minus">-</a>
							<a href="javascript:;" class="shopcart-item-num-c-btn-plus">+</a>
						</p>
					</div>
				</li>
				<li class="shopcart-item-unit-total-price fl">¥ <span>229.00</span></li>
				<li class="shopcart-item-del fl"><a href="javascript:;" >删除</a></li>
				</ul>
			</div>	
			<div class="shopcart-item">
				<ul class="clear-fix">
					<li class="fl checkitem">
						<div class="unchecked"></div>
					</li>
					<li class="fl shopcart-item-img"><img src="./img/shoppingcart_img/shopcartgoods3.png" ></li>
				<li class="fl shopcart-item-intro">
					<div>
						<a href="" target="_blank"> HUAWEI FreeBuds Pro 真无线耳机 无线充版（碳晶黑）主动降噪  人声透传 快充长续航</a>
						</div>
					<div>碳晶黑 无线充版</div>
					<div>分期免息</div>
				</li>
				<li class="shopcart-item-unit-price fl">¥ <span>1199.00</span></li>
				<li class="shopcart-item-num fl">
					<div class="shopcart-item-num-c">
						<input type="num" name="" id="" value="1" />
						<p class="shopcart-item-num-c-btn clear-fix">
							<a href="javascript:;" class="shopcart-item-num-c-btn-minus">-</a>
							<a href="javascript:;" class="shopcart-item-num-c-btn-plus">+</a>
						</p>
					</div>
				</li>
				<li class="shopcart-item-unit-total-price fl">¥ <span>1199.00</span></li>
				<li class="shopcart-item-del fl"><a href="javascript:;" >删除</a></li>
				</ul>
			</div>	
			</div>
			<div class="shopcart-c-bottom">
				<ul class="clear-fix">
					<li class="shopcart-c-bottom-checkall fl">
						<div class="unchecked"></div>
					</li>
					<li class="fl">
						全选
					</li>
					<li class="fl shopcart-c-bottom-delall">
						<a href="javascript:;">删除</a>
						<li class="fr shopcart-c-bottom-settle">
							<a href="javascript:;">立即结算</a>
						</li>
						<li class="fr shopcart-c-bottom-sum">
							<p>
								<label for="">总计: </label>
								<span>&nbsp;¥ &nbsp;</span><span class="shopcart-c-bottom-sum-totalprices">0.00</span>
								<em>
									<b>不含运费</b>
								</em>
							</p>
							<div class="shopcart-c-bottom-choose">
								已选择
								<em class="shopcart-c-bottom-choose-goodsnum">0</em>
								件商品,优惠:
								<span>¥ </span><span>0.00</span>
							</div>
						</li>
				</ul>
			</div>

			</div>
		</div>
		<!-- 网页底部信息 -->
		<div class="html-footer">
			<!-- 底部标语部分 -->
			<div class="html-footer-slogan">
				<div class="html-footer-slogan-c">
					<ul class="clear-fix">
						<li class="fl">
							<a href="" target="_blank">
								<i class="html-footer-slogan-c-l1"></i>
								百强企业 品质保证
							</a>
						</li>
						<li class="fl">
							<a href="" target="_blank">
								<i class="html-footer-slogan-c-l2"></i>
								7天退货 15天换货
							</a>
						</li>
						<li class="fl">
							<a href="" target="_blank">
								<i class="html-footer-slogan-c-l3"></i>
								48元起免运费
							</a>
						</li>
						<li class="fl" style="padding-right: 0;">
							<a href="" target="_blank">
								<i class="html-footer-slogan-c-l4"></i>
								2000家服务店 全国联保
							</a>
						</li>
					</ul>
				</div>
			</div>
			<!-- 底部服务部分 -->
			<div class="html-footer-service">
				<div class="html-footer-service-c clear-fix">
					<div class="html-footer-service-cl fl clear-fix">
						<dl class="fl">
							<dt>
								<p>购物相关</p>
							</dt>
							<dd>
								<ol>
									<li><a href="" target="_blank">购物指南</a></li>
									<li><a href="" target="_blank">配送方式</a></li>
									<li><a href="" target="_blank">支付方式</a></li>
									<li><a href="" target="_blank">常见问题</a></li>
								</ol>
							</dd>
						</dl>
						<dl class="fl">
							<dt>
								<p>保修与退换货</p>
							</dt>
							<dd>
								<ol>
									<li><a href="" target="_blank">保修政策</a></li>
									<li><a href="" target="_blank">退换货政策</a></li>
									<li><a href="" target="_blank">保修状态查询</a></li>
									<li><a href="" target="_blank">配件防伪查询</a></li>
								</ol>
							</dd>
						</dl>
						<dl class="fl">
							<dt>
								<p>维修与技术支持</p>
							</dt>
							<dd>
								<ol>
									<li><a href="" target="_blank">服务店</a></li>
									<li><a href="" target="_blank">预约维修</a></li>
									<li><a href="" target="_blank">手机寄修</a></li>
									<li><a href="" target="_blank">备件价格查询</a></li>
									<li><a href="" target="_blank">上门服务</a></li>
								</ol>
							</dd>
						</dl>
						<dl class="fl">
							<dt>
								<p>特色服务</p>
							</dt>
							<dd>
								<ol>
									<li><a href="" target="_blank">防伪查询</a></li>
									<li><a href="" target="_blank">补购保障</a></li>
									<li><a href="" target="_blank">以旧换新</a></li>
									<li><a href="" target="_blank">礼品包装</a></li>
								</ol>
							</dd>
						</dl>
						<dl class="fl">
							<dt>
								<p>关于我们</p>
							</dt>
							<dd>
								<ol>
									<li><a href="" target="_blank">公司介绍</a></li>
									<li><a href="" target="_blank">华为商城简介</a></li>
									<li><a href="" target="_blank">华为零售店</a></li>
									<li><a href="" target="_blank">商家中心</a></li>
									<li><a href="" target="_blank">意见反馈</a></li>
								</ol>
							</dd>
						</dl>
						<dl class="fl">
							<dt class="relative">
								<p>友情链接</p>
								<div class="html-footer-service-cl-arrows">
									<span class="html-footer-service-cl-larrows notallowed"></span>
									<span class="html-footer-service-cl-rarrows pointer"></span>
								</div>
							</dt>
							<dd style="overflow: hidden;">
								<div class="html-footer-service-cl-linkcontent clear-fix"
									style="width: 318px; margin-left: 0px;">
									<ol class="fl" style="width:158px;">
										<li><a href="" target="_blank">华为集团</a></li>
										<li><a href="" target="_blank">华为CBG官网</a></li>
										<li><a href="" target="_blank">花粉俱乐部</a></li>
										<li><a href="" target="_blank">华为云</a></li>
										<li><a href="" target="_blank">华为应用市场</a></li>
									</ol>

									<ol class="fl" style="width:158px;">
										<li><a href="" target="_blank">华为心声社区</a></li>
										<li><a href="" target="_blank">华为海洋</a></li>
									</ol>
								</div>
							</dd>
						</dl>
					</div>
					<div class="html-footer-service-cr fl">
						<dl>
							<dt>
								<p>950805</p>
							</dt>
							<dd>
								<ol>
									<li>
										<a href="">7x24小时客服热线（仅收市话费）</a>
									</li>
								</ol>
							</dd>
							<dd class="html-footer-service-cr-olf">
								<a href="" class="html-footer-service-cr-ol">
									<i>

									</i>
									在线客服
								</a>
								<div class="html-footer-service-cr-ol-cover"></div>
							</dd>
						</dl>
						<div class="html-footer-service-cr-icon fl clear-fix">
							<h2 class="fl">关注Vmall：</h2>
							<ul class="fl clear-fix">
								<li class="fl">
									<a href=""></a>
									<div class="html-footer-service-cr-icon-code"><img
											src="./img/header_img/O3KMTpn7HHJrc3oZjphy.png"></div>
								</li>
								<li class="fl"><a href=""></a></li>
								<li class="fl"><a href=""></a></li>
								<li class="fl"><a href=""></a></li>
							</ul>
						</div>
					</div>
				</div>
			</div>
			<!-- 底部声明部分 -->
			<div class="html-footer-certify">
				<div class="html-footer-certify-c">
					<div class="html-footer-certify-c-area clear-fix">
						<p class="html-footer-certify-c-area-l fl">
							<a href="">
								<img src="./img/header_img/wLelYbpMVWbj9Xpaa5Fk.png">
							</a>
						</p>
						<div class="html-footer-certify-c-area-m fl f12">
							<ul class="clear-fix">
								<li><a href="">华为集团</a></li>
								<li><a href="">华为CBG官网</a></li>
								<li><a href="">花粉俱乐部</a></li>
								<li><a href="">华为应用市场</a></li>
								<li><a href="">EMUI</a></li>
								<li><a href="">华为终端云空间</a></li>
								<li><a href="">开发者联盟</a></li>
								<li><a href="">华为商城手机版</a></li>
								<li><a href="">网站地图</a></li>
							</ul>
							<a href="" target="_blank">隐私声明</a>
							<a href="" target="_blank">服务协议</a>
							<a href="" target="_blank">COOKIES</a>
							Copyright © 2012-
							<span>2021</span>
							华为终端有限公司 版权所有
							<a href="" target="_blank">粤ICP备19015064号</a>
							<em>|</em>
							<a href="" target="_blank">粤公网安备 44190002003939号</a>
							<br>
							增值电信业务经营许可证：粤B2-20190762
							<em>|</em>
							备案主体编号：44201919072182
							<em>|</em>
							粤新出网备（2021）2号
							<br>
							<a href="" target="_blank">互联网药品信息服务资格证（粤）-非经营性-2020-0102</a>
							| 粤东食药监械经营备20203930
						</div>
						<p class="html-footer-certify-c-area-r fr">
							<a href="" target="_blank"><img src="img/header_img/20160226162415360.png"></a>
						</p>
					</div>
				</div>
			</div>
		</div>
		<!-- 右侧跟随导航部分 -->
		<div class="right-float-main">
			<div class="right-float-main-hungbar">
				<div class="right-float-main-hungbar-content">
					<div class="right-float-main-hungbar-content-common">
						<a href="" target="_blank" class="right-float-main-hungbar-content-common-cart"
							style="display: block;">
							<span style="display: none;"></span>
							<i class="f12">购物车</i>
						</a>
						<a href="" target="_blank" class="right-float-main-hungbar-content-common-service"
							style="display: block;">
							<i class="f12">在线客服</i>
						</a>
						<a href="" target="_blank" class="right-float-main-hungbar-content-common-feedback"
							style="display: block;">
							<i class="f12">自助服务</i>
						</a>
						<a href="" target="_blank" class="right-float-main-hungbar-content-common-top">
							<i class="f12">返回顶部</i>
						</a>
					</div>
				</div>
			</div>
		</div>
		<script src="js/jquery-3.6.0.min.js"></script>
		<script src="js/header.js"></script>
		<script src="js/shoppingcart.js"></script>
		<script type="text/javascript">
			function setCookie(cname, cvalue, exdays) {
				var d = new Date();
				d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
				var expires = "expires=" + d.toGMTString();
				document.cookie = cname + "=" + cvalue + "; " + expires;
			}
		
			function getCookie(cname) {
				var name = cname + "=";
				var ca = document.cookie.split(';');
				for (var i = 0; i < ca.length; i++) {
					var c = ca[i].trim();
					var arrC = c.split("=");
					if (arrC[0] == cname) {
						return arrC[1];
					}
				}
				return "";
			}
		</script>
		<script type="text/javascript">
			$('.add_cart').click(function() {
				var photo = $(this).siblings('.photo').find('img').attr('src');
				var name = $(this).siblings('.title').text().trim();
				var price = $(this).siblings('.price').text().trim();
				var id = $(this).parent('li').data('id');
				var goods = {
					id: id,
					name: name,
					photo: photo,
					price: price,
					num: 1
				}
		
				//读取cookie,在原先购物车数据基础上,添加新数据
				var cart = getCookie('cart');
				if (cart) {
					var goodsList = JSON.parse(cart);
				} else {
					var goodsList = [];
				}
				//检查购物车是否含有此商品
				var isExist = false;
				goodsList.forEach(function(item) {
					if (item.id == id) {
						isExist = true;
						item.num++;
					}
				})
				if (!isExist) {
					goodsList.push(goods);
				}
				//添加cookie
				setCookie('cart', JSON.stringify(goodsList));
		
		
			})
		</script>
	</body>
</html>
